<template>
  <view>
    <button type="primary" @click="login">微信登录</button>
  </view>
</template>

<script>
// import { getTokenRequest } from '@/api/user.js'
export default {
  data() {
    return {
      // 发起获得用户 token 请求所需数据
      getTokenData: {},
      // 单独存放的 code（用户登录凭证）
      userCode: ''
    }
  },

  onLoad() {
    this.getCode()
  },

  methods: {
    /**
     * 注意：
     * 在开发时，不能先获取微信用户信息之后才去获取用户登录凭证，因为这样会导致无法发起请求，相当于数据更新前后的问题
     * 因此，我们需要在一进入页面的时候，就获取到用户登录凭证 code，并存入 data
     */
    // 获取用户登录凭证：
    async getCode() {
      const { code } = await uni.login()
      this.userCode = code
    },

    // 登录：
    async login() {
      /**
       * 微信登录流程：
       * 1、页面加载后，调用 uni.login() 获取用户登录的凭证
       * 2、调用 getUserProfile 方法，获取微信用户信息
       * 3、调用后台 api 登录接口，传入获取微信用户信息进行登录
       * 注意：由于微信个人开发者没有项目开发者权限，无法调取接口获取 token，因此这里我造假一个
       * 4、登录成功后获取 token 持久化到本地
       */

      // 以下是常规操作画面：
      // 获取用户信息：
      // const { encryptedData, rawData, iv, signature } = await uni.getUserProfile({
      //   desc: '获取微信用户信息登录'
      // })
      // // 浅拷贝，获取发起请求所需数据
      // this.getTokenData = {
      //   encryptedData,
      //   rawData,
      //   iv,
      //   signature,
      //   code: this.userCode
      // }
      // // 获取用户登录所需 token
      // const {msg, data} = await getTokenRequest(this.getTokenData)
      // if (msg.status === 200) {
      //   // 获取token成功：
      //   // 存储本地并跳转
      //   uni.setStorageSync('fly-shopping-token', data.token)
      //   uni.navigateBack()
      // } else {
      //   uni.showToast({
      //     title: '登陆失败，请重试！'
      //   })
      // }

      // 以下是造假 token ：
      if (this.userCode) {
        // 将用户登录凭证 设置为 token
        uni.setStorageSync('fly-shopping-token', this.userCode)
        uni.navigateBack()
      } else {
        uni.showToast({
          title: '登陆失败，请重试！'
        })
      }
    }
  }
}
</script>

<style lang="scss" scoped>
  button {
    width: 600rpx;
    margin: 200rpx auto 0;
  }
</style>